<script setup>
import useAuthStore from '@/store/auth'
import api from '@/api'
import { useRouter } from 'vue-router'
import { ref } from 'vue';
import { Button } from 'vant'

const $authStore = useAuthStore()
const $router = useRouter()

const onClickLeft = () => {
  $router.replace('/')
}

const list = ref([])
const getUserFeedBackList = async() => {
  try {
    const res = await api.get('feedback/userFeedBackList')
    console.log('getUserFeedBackList',res)
    list.value = res.data.items
  } catch (error) {
    console.error(error)
  }
}
getUserFeedBackList()
</script>

<template>
  <div>
    <van-nav-bar :fixed="true" left-text="返回" left-arrow @click-left="onClickLeft">
      <template #title>
        <div class="navbar">
          <div>意见反馈</div>
        </div>
      </template>
      <template #right>
        <van-button @click="$router.push('/feedback/details')" size="small" type="primary">去反馈</van-button>
      </template>
    </van-nav-bar>

    <div class="gap"></div>

    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <van-cell
        v-for="(item,index) in list"
        @click="$router.push('/feedback/details?id=' + item.id)"
        :key="index"
        :title="item.title"
        :label="item.content"
      >
        <van-tag v-if="item.replies?.content" type="danger">有回复</van-tag>
      </van-cell>
    </van-list>
  </div>
</template>

<style lang="scss" scoped>
.gap {
  width: 100%;
  height: 50px;
}
</style>
